<template>
	<view>
		<view class="search_fixed">
			<mySearch :columnList="columnList" @SearchEvent="SearchEvent" @ClearEvent="ClearEvent"></mySearch>
		</view>

		<mescroll-body @init="mescrollInit" @down="downCallback" :down="$gl.downOption" @up="upCallback"
			:up="$gl.upOption" :top="$gl.upOption.top">
			<myGroupItem :dataList="list" :columnList="columnList" @toPage="toPage"></myGroupItem>
		</mescroll-body>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				columnList: [],
				filter: {
					"list": []
				},
				listCode: "TSY_SmartUnion_FemaleWorkerUserUnitList",
				api: "",
				formUrl: ""
			}
		},
		onReady() {
			this.$gl.getColumn(this).then(res => {
				this.api = res
				this.mescroll.triggerUpScroll();
			})
		},
		methods: {
			upCallback(page) {
				this.loadData(page.num, page.size)
			},
			loadData(index, size, obj = {}) {
				this.$gl.loadMore(this, index, size, obj);
			},
			SearchEvent(e) {
				this.list = [];
				this.filter = e;
				this.mescroll.resetUpScroll()
			},
			ClearEvent(e) {
				this.list = [];
				this.filter.list = [];
				this.mescroll.resetUpScroll()
			},
			toPage(e) {
				this.$gl.setStorage({
					action: "view",
					Key: e.BDBM,
					Run_ID: e.Run_ID ?? "",
					Step_Handler_ID: e.Step_Handler_ID ?? ""
				}, this.formUrl);
			}
		}
	}
</script>


<style lang="scss">
	/deep/ .u-cell__value {
		text-align: right;
		margin-left: 30px;
	}

	/deep/ .u-cell__value span {
		text-align: left;
		display: inline-block;
	}

	/deep/ .u-cell__title-text {
		min-width: 100px;
	}
</style>
